/<template>
  <div>
    <ul v-if="list.length">
      <li class="item" v-for="(item, index) in list" :key="index">
        <h3>
          <b>{{ item.name }}</b>
          <span>{{ item.tel }}</span>
        </h3>
        <p>
          {{ item | sumAddress }}
        </p>
        <div class="set">
          <div class="left">
            <input type="checkbox" v-model="item.isDefault">
            <span v-if="item.isDefault">已设为默认</span>
            <span v-else class="red">设为默认</span>
          </div>
          <div class="right">
            <button @click="editMask(item,index)">修改</button>
            <button>删除</button>
          </div>
        </div>
      </li>
    </ul>
    <div v-else>
      您当前还没有添加地址
    </div>
  </div>
</template>

<script>
export default {
  props: {
    list: Array,
  },
  filters: {
    sumAddress(value) {
      return value.province + value.city + value.county + value.addressDetail;
    },
    toBig(value){
        console.log(value);
        const obj={
            0:'零'
        }
        return obj[value]?obj[value]:value;
    }
  },
  methods: {
    editMask(item,index) {
      this.bus.$emit('changeflag',item,index);
    },
  },
};
</script>

<style>
.item {
  width: 100%;
  height: 150px;
  padding: 10px;
  line-height: 40px;
  border-bottom: 1px solid #ccc;
}
.set {
  width: 100%;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.set button {
  margin: 10px;
  width: 40px;
  height: 30px;
}
.red {
  color: red;
}
</style>